<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>相册呀</title>
        <link rel="stylesheet" href="css/reset.css" />
		<style>
            *{
                padding: 0;
                margin: 0;
            }
            .imgs {
                width: 100%;
                /* height: 100%; */
            }
            .div {
                width: 100%;
                height: 940px;               
                position:absolute;
                background: url("img/背景.jpg") no-repeat;
                background-size: 100%;
                z-index:-1;
            }
        </style>
		
    </head>
    <body>
		<div class="div" id="formbackground" id="div">  
			<!-- <img class="imgs" src="img/背景.jpg" onclick="play()" alt="user"/>   -->
		</div>
		
		
		
		
		<!--背景音乐 -->
		<audio id='audio' src="./mp3/丁可-If.mp3" autoplay="autoplay"></audio>
		    
		    <script>
		            var audio=document.getElementById('audio');
		            audio.play();
               
		    </script>
		
		
		
		
		<!-- <script>
		window.onload = function(){ 
		     var audio = document.getElementById('audio');
		         audio.pause();//打开页面时无音乐
		}
		function play() {
		    var audio = document.getElementById('audio');
		    if (audio.paused) {
		        audio.play();
		        document.getElementById('musicImg').src="img/背景.jpg";
		    }else{
		        audio.pause();
		        audio.currentTime = 0;//音乐从头播放
		        document.getElementById('musicImg').src="img/背景.jpg";
		    }
		}
		</script> -->
		
		
		<!-- <audio autoplay="autoplay"   id="myaudio"  loop="loop" preload="auto" src="mp3/不是机器人啊.mp3">  
		<script type="text/javascript">
			var myAuto = document.getElementById('myaudio');
		    myAuto.play();
		    document.addEventListener("WeixinJSBridgeReady", function () {
		      myAuto.play();
		    }, false);
		
		</script> -->
		
		
		
		
        <div class="wrap">
    <!--    /*包裹所有元素的容器*/-->
        <div class="cube">
            <!--前面图片 -->
            <div class="out_front">
                <img src="img/1.jpg"  class="pic"/>
            </div>
            <!--后面图片 -->
            <div class="out_back">
                <img src="img/2.jpg"  class="pic"/>
            </div>
            <!--左图片 -->
            <div class="out_left">
                <img src="img/3.jpg"  class="pic"/>
            </div>
            <div class="out_right">
                <img src="img/4.jpg"  class="pic"/>
            </div>
            <div class="out_top">
                <img src="img/3.jpg"  class="pic"/>
            </div>
            <div class="out_bottom">
                <img src="img/6.jpg"  class="pic"/>
            </div>
            <!--小正方体 --> 
			
			
            <span class="in_front">
                <img src="img/7.jpg" class="in_pic" />
            </span>
            <span class="in_back">
                 <img src="img/8.jpg" class="in_pic" />
            </span>
            <span class="in_left">
                <img src="img/9.jpg" class="in_pic" />
            </span>
            <span class="in_right">
                <img src="img/10.jpg" class="in_pic" />
            </span>
            <span class="in_top">
                <img src="img/11.jpg" class="in_pic" />
            </span>
            <span class="in_bottom">
                <img src="img/12.jpg" class="in_pic" />
            </span>
        </div>
        </div>
        
    </body>
</html>
